<div id="system" (contextmenu)="goBack($event)" (keydown)="getKey($event)" tabindex="1" (focus)="getFocus()">
  <header id="content-header">
    <!-- 时间 -->
    <div class="header-times">
      <p>{{ dateTimes[0] }}</p>
      <p>{{ dateTimes[1] }}</p>
      <p>{{ dateTimes[2] }}</p>
      <p>{{ dateTimes[3] }}</p>
      <p>年</p>
      <p>{{ dateTimes[4] }}</p>
      <p>{{ dateTimes[5] }}</p>
      <p>月</p>
      <p>{{ dateTimes[6] }}</p>
      <p>{{ dateTimes[7] }}</p>
      <p>日</p>
      <p> - </p>
      <p>{{ dateMonths[0] }}</p>
      <p>{{ dateMonths[1] }}</p>
      <p>时</p>
      <p>{{ dateMonths[2] }}</p>
      <p>{{ dateMonths[3] }}</p>
      <p>分</p>
      <p>{{ dateMonths[4] }}</p>
      <p>{{ dateMonths[5] }}</p>
      <p>秒</p>
    </div>
    <!-- 图标、数据 -->
    <div class="header-icon">
      <div class="margin-l" (click)="getKey($event, 1)">
        <img [class.logo]="logoTitle" [src]="companyLogo"/>
      </div>
      <div class="header-nav margin-l" *ngFor="let head of headList">
        <div class="header-top" *ngFor="let i of head.titleData">
          <p>{{ i.lable }}</p>
          <b>
            <span *ngIf=' ("XIN" !== i["feild"]) && ("XU" !== i["filed"]) '>{{ titleData[i['feild']] }} </span>
            <span *ngIf=' ("XIN" === i["feild"]) && ("XU" === i["filed"]) '>{{ titleData[i['feild']] }} /  {{ titleData[i['filed']] }}</span>
          </b>
        </div>
      </div>
    </div>
  </header>
  <div id="content-box">
    <div id="flexCon">
      <div class="flex-row">
        <div class="flex-cell flex-cell-l">
          <div class="chart-wrapper">
            <div class="chart-title">
              <p class="margin-l"> 今日到店报价 </p>
              <ul class="margin-lc">
                <li> 总数：<span *ngIf="leftHead">{{ leftHead['BJZS'] }}, </span></li>
                <li> 已报价：<span *ngIf="leftHead">成功 {{ leftHead['YBJ'] }} / 失败{{ leftHead['BJSB'] }}, </span></li>
                <li> 未报价：<span *ngIf="leftHead">{{ leftHead['WBJ'] }} / <span
                  style="color: #f8cc04">{{ leftHead['CSWBJ'] }}</span></span></li>
              </ul>
            </div>
            <div class="vertical">
              <div class="chart-table">
                <total-table [parmas]="leftData[0]" [companyId]="companyData"></total-table>
              </div>
              <div class="chart-table">
                <div>
                  <total-table [parmas]="leftData[1]" [companyId]="companyData"></total-table>
                </div>

                <!-- 饼图 -->
                <div class="the-pie">
                  <p> 本月保险销售 </p>
                  <div style="display: flex">
                    <div class="pie-box">
                      <div class="pie-nav">
                        <div id="mountNode" class="pie-tran"></div>
                      </div>
                    </div>
                    <div class="pie-box">
                      <div class="pie-nav">
                        <div id="container" class="pie-tran"></div>
                      </div>
                    </div>
                  </div>

                </div>
              </div>
            </div>
          </div>
        </div>

        <div class="flex-cell flex-cell-c">
          <div class="chart-wrapper">
            <div class="chart-title">
              <p class="margin-l"> 今日报案跟踪 </p>
              <ul class="margin-lc">
                <li><span>人保 {{ rightHead['RBBAS'] }} / 到店 {{ rightHead['RBDDS'] }} &nbsp;,&nbsp;</span></li>
                <li><span>人寿 {{ rightHead['RSBAS'] }} / 到店 {{ rightHead['RSDDS'] }} &nbsp;,&nbsp;</span></li>
                <li><span>平安 {{ rightHead['PABAS'] }} / {{ rightHead['PADDS'] }} &nbsp;,&nbsp;</span></li>
                <li><span>其他 {{ rightHead['QTBAS'] }} / {{ rightHead['QTDDS'] }} &nbsp;&nbsp;</span></li>
              </ul>
            </div>
            <p class="title-img">
              <!--<img src="assets/tmp/img/bi/swB.png">-->
            </p>
            <div class="title-table">
              <div class="chart-table" *ngFor="let data of rightTopData" [ngStyle]="{width: data.titleWidth }">
                <total-table [parmas]="data" [companyId]="companyData"></total-table>
              </div>
            </div>

          </div>
        </div>
      </div>

      <div class="flex-row margin-l margin-t">
        <div class="flex-cell flex-cell-r">
          <div class="chart-wrapper">
            <div class="vertical-botoom">
              <div class="chart-table-left-bottom" *ngFor="let data of leftBottmData">
                <total-table [parmas]="data" [companyId]="companyData"></total-table>
              </div>
            </div>
          </div>
        </div>
        <div class="flex-cell flex-cell-b">
          <div class="chart-wrapper">
            <div class="vertical-botoom">
              <div class="chart-table-right-table">
                <total-table [parmas]="rightTable[0]" [companyId]="companyData"></total-table>
              </div>
              <div class="chart-table-right-bottom">
                <div *ngFor="let data of rightBottom" [ngStyle]="{width: data.titleWidth }">
                  <total-table [parmas]="data" [companyId]="companyData"></total-table>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>

    <!--<div class="main-copy">-->
      <!--Copyright-->
      <!--<i class="anticon anticon-copyright"></i>-->
      <!--{{year}} 本系统由猿猿软件提供技术支持-->
    <!--</div>-->
  </div>
  <company-modal (paramsOut)="changeCompany($event)"></company-modal>
</div>
